/* 
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */

// This renders to the document

API.viewport = API.viewport || {};

API.viewport.BorderViewport = function(config){
    
    var m = document.createElement('div'),
        c = document.createElement('div'),
        n = document.createElement('div'),
        s = document.createElement('div'),
        e = document.createElement('div'),
        w = document.createElement('div');

    c.className = 'center';
    n.className = 'north';
    s.className = 'south';
    e.className = 'east';
    w.className = 'west';
    
    m.appendChild(c);
    m.appendChild(n);
    m.appendChild(s);
    m.appendChild(e);
    m.appendChild(w);
    
    var DOM = m;
    
    API.apply(this,config,{        
        DOM     : DOM,
        center  : [],
        north   : [],
        south   : [],
        east    : [],
        west    : []        
    });
    
    
    var items = this.center;
    for(var index in items){
        c.appendChild(items[index].DOM);
    }
    
    items = this.north;
    for(var index in items){
        n.appendChild(items[index].DOM);
    }
    
    items = this.south;
    for(var index in items){
        s.appendChild(items[index].DOM);
    }
    
    items = this.east;
    for(var index in items){
        e.appendChild(items[index].DOM);
    }
    
    items = this.west;
    for(var index in items){
        w.appendChild(items[index].DOM);
    }
    
    document.body.appendChild(DOM);

};